
		<!DOCTYPE html>
		<html lang="zh-CN">
		<head>
		    <meta charset="UTF-8">
		    <meta name="viewport" content="width=device-width, initial-scale=1.0">
		    <title>提醒事项</title>
		    <style>
		        body {
		            font-family: Arial, sans-serif;
		            background-color: #f0f0f0;
		            display: flex;
		            justify-content: center;
		            align-items: center;
		            height: 100vh;
		            margin: 0;
		        }
		        .reminder {
		            background-color: #fff;
		            border-radius: 10px;
		            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
		            width: 300px;
		            padding: 20px;
		        }
		        .reminder h2 {
		            margin: 0 0 10px;
		            text-align: center;
		            color: #333;
		        }
		        .reminder form {
		            display: flex;
		            margin-bottom: 10px;
		        }
		        .reminder input[type="text"] {
		            flex: 1;
		            padding: 5px;
		            border: 1px solid #ccc;
		            border-radius: 5px;
		            margin-right: 5px;
		        }
		        .reminder button {
		            padding: 5px 10px;
		            border: none;
		            border-radius: 5px;
		            cursor: pointer;
		            background-color: #007BFF;
		            color: #fff;
		        }
		        .reminder button:hover {
		            background-color: #0056b3;
		        }
		        .reminder ul {
		            list-style: none;
		            padding: 0;
		            margin: 0;
		        }
		        .reminder li {
		            display: flex;
		            justify-content: space-between;
		            align-items: center;
		            padding: 10px 0;
		            border-bottom: 1px solid #ccc;
		        }
		        .reminder li:last-child {
		            border-bottom: none;
		        }
		        .reminder li span {
		            flex: 1;
		        }
		        .reminder li button {
		            background-color: #007BFF;
		            color: #fff;
		            margin-left: 5px;
		        }
		        .reminder li button:hover {
		            background-color: #0056b3;
		        }
		        .reminder li button.delete {
		            background-color: #dc3545;
		        }
		        .reminder li button.delete:hover {
		            background-color: #c82333;
		        }
		    </style>
		</head>
		<body>
		    <div class="reminder">
		        <h2>提醒事项</h2>
		        <form>
		            <input type="text" placeholder="内容" />
		            <button type="button">添加</button>
		        </form>
		        <ul>
		            <li>
		                <span>1. 学习</span>
		                <div>
		                    <button type="button">下移</button>
		                    <button type="button">上移</button>
		                    <button type="button" class="delete">删除</button>
		                </div>
		            </li>
		            <li>
		                <span>2. 睡觉</span>
		                <div>
		                    <button type="button">下移</button>
		                    <button type="button">上移</button>
		                    <button type="button" class="delete">删除</button>
		                </div>
		            </li>
		            <li>
		                <span>3. 吃饭</span>
		                <div>
		                    <button type="button">下移</button>
		                    <button type="button">上移</button>
		                    <button type="button" class="delete">删除</button>
		                </div>
		            </li>
		        </ul>
		    </div>
		</body>
		</html>


